#animate-preview{
	h4{
		margin: 0;
		line-height: 31px;
	}
}
.pa-modal-window{
	> .modal-dialog{
    	width: 500px;
    	margin: 0;
	    .modal-header{
	    	background-color: $main;
	    	padding-bottom: 0;
	    	border-bottom: 0;
	    	.modal-title{
	    		color: $white;
	    	}
	    	.nav{
			    padding: 0;
			    margin: 10px 0 0 0;
			    list-style: none;
			    border: none;
			    clear: both;
			    margin-bottom: -1px;
			   	.active{
			   		a{
			   			color: $main;
			   			background-color: $white !important;
			   			font-weight: 500;
			   		}
			   	}
			    a{
			    	color: $white;
			    	border: none;
			    	&:hover,
			    	&:focus{
			    		border: none;
			    		background-color: transparent;
			    	}
			    }
	    	}
	    }

	    .pa-modal-window-inner{
		    background: $white;
		    color: $main_color;
		    box-shadow: 1px 1px 4px rgba(0,0,0,.25);
		    position: relative;
		    max-height: inherit;
		    display: -webkit-box;
		    display: -ms-flexbox;
		    display: flex;
		    -webkit-box-orient: vertical;
		    -webkit-box-direction: normal;
		    -ms-flex-direction: column;
		    flex-direction: column;
		    -webkit-box-align: stretch;
		    -ms-flex-align: stretch;
		    align-items: stretch;
		    -ms-flex-line-pack: stretch;
		    align-content: stretch;
		    -ms-flex-preferred-size: 100%;
		    flex-basis: 100%;

		    .pa-header-container{
		    	background-color: $main;
		    	.panel-heading{
		    		color: $white;
		    	}
		    }
	    }

	    .control-label{
		    font-size: 13px;
		    font-weight: normal;
		    color: #666;
	    }
	    .form-group{
	    	padding: 10px 0;
	    }
	    .form-control,
	    input[type="text"],
	    input[type="search"],
	    input[type="password"],
	    textarea,
	    select {
		    display: block;
		    width: 100%;
		    height: 31px;
		    padding: 6px 8px;
		    font-size: 12px;
		    line-height: 1.42857;
		    color: #555;
		    background-color: #F5F8F9;
		    background-image: none;
		    border: 1px solid #C7D6DB;
		    -webkit-transition: border-color ease-in-out 0.15s,box-shadow ease-in-out 0.15s;
		    -o-transition: border-color ease-in-out 0.15s,box-shadow ease-in-out 0.15s;
		    transition: border-color ease-in-out 0.15s,box-shadow ease-in-out 0.15s;
		}
		select[multiple="multiple"] {
			height: auto;
		}
		.input-group-addon {
		    padding: 6px 8px;
		    font-size: 12px;
		    font-weight: normal;
		    line-height: 1;
		    color: #555;
		    text-align: center;
		    background-color: #F5F8F9;
		    border-top: 1px solid #C7D6DB;
		    border-left: 1px solid #C7D6DB;
		    border-bottom: 1px solid #C7D6DB;
		    border-right: 1px solid #C7D6DB;
		    border-radius: 3px;
		    border-left: 0;
		    border-top-left-radius: 0;
		    border-bottom-left-radius: 0;
		}
	}
    position: fixed;
    z-index: 1050;
    opacity: 0;
    top: 0px;
    left: 50%;
    padding: 5px;
    transition: opacity 300ms;
    -webkit-transition: opacity 300ms;
    -moz-transition: opacity 300ms;

    &.ui-draggable{
    	opacity: 1;
    }
}
.pa-modal{
	.modal-header{
		background: $info_bg_gradient;
		color: $white;
		padding-bottom: 0;
		.modal-title{
			color: $white;
			line-height: 1;
			font-size: 18px;
			margin: 0;
			text-transform: capitalize;
		}
		.input-group{
			position: relative;
			float: right;
			margin-right: 10px;
			span{
			    position: absolute;
			    left: 7px;
			    top: 3px;
			    color: $main;
			    &:hover{
			    	cursor: pointer;
			    }
			}
		}
		#search-text{
			float: right;
			font-size: 12px;
			line-height: 1;
			min-width: 200px;
			border-radius: 3px;
			border: 1px solid $white;
			padding: 5px 5px 5px 23px;
			margin-top: -2px;
			color: $main;

			&:focus{
				outline: none;
			}
		}
		.close{
			float: right;
		    font-size: 30px;
		    font-weight: bold;
		    line-height: 1;
		    color: $white;
		    filter: alpha(opacity=20);
		    margin-top: -4px;
		    border: none;
		    background: transparent;

		    &:focus{
		    	outline: none;
		    }
		}
		.nav{
			padding: 0;
			margin: 0;
			list-style: none;
			clear: both;
			margin-bottom: -1px;

			li {
				display: inline-block;

				a{
					display: block;
					color: $white;
					text-decoration: none;
					padding: 8px 10px;
					text-transform: capitalize;
					border-radius: 3px 3px 0 0px;
					border: 1px solid transparent !important;

					&:hover{
						border: 1px solid transparent !important;
					}
				}

				&.active{
					a{
						background-color: $white;
						color: $main;
					}
				}
			}
		}
	}
	.modal-body{
		overflow-x: hidden;
		.tab-content {
			ul{
				list-style: none;
				padding: 0;
				margin: 0;
			}
			.element-item{
				padding: 20px;
				color: $white;
				background-color: $main_lower;
				transition: all 0.3s;
				-moz-transition: all 0.3s;
				-webkit-transition: all 0.3s;
				-ms-transition: all 0.3s;
				-o-transition: all 0.3s;
				&:hover{
					cursor: pointer;
					background-color: $main;
				}
			}
		}
	}
}